import {connect} from "react-redux";
import {toggleTodo} from "../actions";
import {TodoList} from "../components/TodoList";

const getVisibleTodos = (todos, filter) => {
    switch(filter) {
        case "SHOW_ALL":
            return todos;
        case "SHOW_COMPLETED":
            return todos.filter(t => t.completed);
        case "SHOW_ACTIVE":
            return todos.filter(t => !t.completed);
    }
}

const mapStateToProps = (state) => {
    // console.log("VisibilityFilter： " + state.todos + " # " + state.visibilityFilter);
    return {
        todos: getVisibleTodos(state.todos, state.visibilityFilter)
    }
}

const mapDispatchToProps = (dispatch) => {
    return {
        onTodoClick: (id) => {
            dispatch(toggleTodo(id));
        }
    }
}

const VisibleTodoList = connect(
    mapStateToProps,
    mapDispatchToProps
)(TodoList);

export {VisibleTodoList};